﻿<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Rippoll.Master" CodeBehind="CreatePoll.aspx.cs" Inherits="RipPoll.Web.CreatePoll" %>
<asp:Content ContentPlaceHolderID="rippollMainBody" runat="server">
        <script type="text/javascript">
            var choiceCount = 1;
            var rootId = "rippollMainBody_";
            var rootName = "ctl00$rippollMainBody$";

            $(document).ready(function () {

                $("#divchoices").children().hide();

                $("input[name='ctl00$rippollMainBody$rdoCategoryList']").live('click', function () {
                    var valu = $(this).val();
                    $('#' + rootId + 'categoryTypeId').val(valu);
                });



                $('input[name="rdoCh"]').live('click', function () {
                    var valu = $(this).val();
                    $('#' + rootId + 'choiceTypeId').val(valu);
                    $("#" + rootId + "totalchoicecount").val(choiceCount);

                    if (valu == '1')
                        $("#divchoices").children().hide();
                    else
                        $("#divchoices").children().show();
                });

                $('#' + rootId + 'btnAddChoice').click(function () {
                    choiceCount++;
                    tabBody = document.getElementById("choicetable");
                    row = document.createElement("tr");
                    row.id = rootId + "choiceRow" + choiceCount;

                    cell1 = document.createElement("td");
                    textnode1 = document.createElement("input");
                    textnode1.id = rootId + "txtChoice" + choiceCount;
                    textnode1.name = rootName + "txtChoice" + choiceCount;
                    textnode1.type = "text";
                    textnode1.setAttribute("style", "width:450px;");
                    textnode1.setAttribute("runat", "server");
                    textnode1.setAttribute("class", "smallText");

                    cell1.appendChild(textnode1);

                    btnnode1 = document.createElement("input");
                    btnnode1.type = "button";
                    btnnode1.id = rootId + "btnDelete" + choiceCount;
                    btnnode1.value = "X";
                    btnnode1.setAttribute("class", "smallText");
                    //btnnode1.onclick = new Function(" alert('hi'); alert(document.getElementById('" + row.id + "').id); document.getElementById('choicetable').removeChild(document.getElementById('" + row.id + "')); choiceCount--; ");
                    btnnode1.onclick = new Function(" document.getElementById('choicetable').removeChild(document.getElementById('" + row.id + "')); choiceCount--; document.getElementById('" + rootId + "totalchoicecount + ').value = choiceCount;");

                    cell1.appendChild(btnnode1);
                    row.appendChild(cell1);
                    tabBody.appendChild(row);

                    $("#" + rootId + "totalchoicecount").val(choiceCount);

                    //document.getElementById("totalchoicecount").value = choiceCount;

                });

                $('#' + rootId + 'btncreatePoll').click(function () {

                    if ($('#' + rootId + 'txtPollName').val() == "") {
                        alert("Enter Poll Name");
                        $('#' + rootId + 'txtPollName').focus();
                        return false;
                    }

                    if ($('#' + rootId + 'categoryTypeId').val() == "") {
                        alert("Select Category");
                        return false;
                    }

                    if ($('#' + rootId + 'choiceTypeId').val() == "") {
                        alert("Select Choice");
                        return false;
                    }

                    var retVal = true;
                    if ($('#' + rootId + 'choiceTypeId').val() == "2" ||
                    $('#' + rootId + 'choiceTypeId').val() == "3" ) {                        
                        $("[id^=" + rootId + "txtChoice]").each(function () {
                            if ($(this).val().length == 0) {
                                alert("Enter value for choice");
                                retVal = false;
                                return retVal;
                            }
                        });
                    }
                    return retVal;

                });


                $('#' + rootId + 'txtPollName').focusout(function () {
                    if ($('#' + rootId + 'txtPollName').val() == "") {
                        alert("Enter Poll Name");
                        $('#' + rootId + 'txtPollName').focus();
                        return false;
                    }
                });

            });

            

//            function addRow() {
//                choiceCount++;                
//                tabBody = document.getElementById("choicetable");
//                row = document.createElement("tr");
//                row.id = "choiceRow" + choiceCount;

//                cell1 = document.createElement("td");
//                textnode1 = document.createElement("input");
//                textnode1.id = "txtChoice" + choiceCount;
//                textnode1.name = "txtChoice" + choiceCount;
//                textnode1.type = "text";            
//                textnode1.setAttribute("runat", "server");
//                cell1.appendChild(textnode1);
//                
//                btnnode1 = document.createElement("input");                
//                btnnode1.type = "button";
//                btnnode1.id = "btnDelete" + choiceCount;
//                btnnode1.value = "X";
//                //btnnode1.onclick = new Function(" alert('hi'); alert(document.getElementById('" + row.id + "').id); document.getElementById('choicetable').removeChild(document.getElementById('" + row.id + "')); choiceCount--; ");
//                btnnode1.onclick = new Function(" document.getElementById('choicetable').removeChild(document.getElementById('" + row.id + "')); choiceCount--; document.getElementById('totalchoicecount').value = choiceCount;");
//                
//                cell1.appendChild(btnnode1);
//                row.appendChild(cell1);
//                tabBody.appendChild(row);

//                document.getElementById("totalchoicecount").value = choiceCount;
//                                
//                return false;
//            }


//            function OnSelectedIndexChange() {

//                var e = document.getElementById("cboPollChoice");
//                if (e.selectedIndex == 2) {
//                    document.getElementById("txtChoice0").disabled = false;
//                    document.getElementById("btnAddChoice").disabled = false;
//                }
//                else {
//                    document.getElementById("txtChoice0").disabled = true;
//                    document.getElementById("btnAddChoice").disabled = true;
//                }

//            }

        </script>
    <br /> <br /><br /> 
    <div style="padding:left 25px;">
        <table id='maintable'>
            <tr>
                <td align="right">   
                    <asp:Label ID='lblPollName' Text='Poll Name:' runat="server" CssClass="smallText"></asp:Label>
                </td>
                <td align="left">   
                    <asp:TextBox ID='txtPollName' Text='' runat="server" CssClass="smallText"></asp:TextBox>    
                </td>            
            </tr>    
            <tr>
                <td align="right">   
                    <asp:Label ID='lblPollCategory' Text='Poll Category:' runat="server" CssClass="smallText"></asp:Label>
                </td>
                <td align="left">   
                    <asp:RadioButtonList ID="rdoCategoryList"  runat="server" RepeatDirection="Horizontal" CssClass="smallText"></asp:RadioButtonList>
                </td>
            </tr>
            <tr>        
                <td align="right" valign="top">   
                    <asp:Label ID='lblPollChoiceType' Text='Poll Choice:' runat="server" CssClass="smallText"></asp:Label>
                </td>
                <td align="left" class="smallText">
                    <input type="radio" name="rdoCh" value='1' class="smallText" />
                    Yes/No
                    <br />
                    <input type="radio" name="rdoCh" value='2' class="smallText" />
                    Multiple choice answers (fill in the answer options)
                    <br />
                    <input type="radio" name="rdoCh" value='3'  class="smallText" />
                    Fill in the highest to lowest answers (fill in the answer options)
                    <br />
                    <div id="divchoices">
                        <table>
                            <tr>
                                <td>
                                    <table id="choicetable">
                                        <tr>
                                            <td>
                                                <asp:TextBox ID="txtChoice1"    CssClass="smallText"  runat="server" Width="450px"></asp:TextBox>
                                                <input id="btnAddChoice" type="button" value="Add Choice" class="smallText" runat="server" />                                            
                                            </td>
                                        </tr>                    
                                    </table>                    
                                 </td>
                            </tr>
                        </table>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td align="left">
                    <asp:Button Text="Create Poll" ID="btncreatePoll" runat="server" onclick="btncreatePoll_Click" CssClass="smallText" />
                </td>
            </tr>
        </table>
    </div>
    <input type="hidden" runat="server" id="totalchoicecount" />
    <input type="hidden" runat="server" id="choiceTypeId" />
    <input type="hidden" runat="server" id="categoryTypeId" />

<br /> <br /><br /> 
</asp:Content>